<template>
  <div id="app">
    <!-- <my-tab></my-tab> -->

    <button @click="showMessageBox">打开</button>
    <button @click="$messageBox.info({
      title: '这是一个普通的标题',
      content: '这是普通的内容'
    })">info</button>
    <button @click="showSuccessMessageBox">success</button>
    <button @click="$messageBox.warning({
      title: '这是一个警告的标题',
      content: '这是警告的内容'
    })">warning</button>
    <button @click="$messageBox.danger({
      title: '这是一个错误的标题',
      content: '这是错误的内容'
    })">danger</button>
  </div>
</template>

<script>

import { MyTab } from './components';

export default {
  name: 'App',
  components: {
    MyTab
  },
  methods: {
    showMessageBox() {
      this.$messageBox.show({
        title: '这是一个成功的标题',
        content: '这是成功的内容',
        type: 'success'
      }, () => {
        console.log('success over');
      })
    },
    showSuccessMessageBox() {
      this.$messageBox.success({
        title: '这是一个成功的标题',
        content: '这是成功的内容'
      }, () => {
        console.log('success over');
      })
    }
  }
}
</script>

<style lang="scss">

</style>
